<template>
	<div class="audio-view">
		<audio controls ref="audioPlayer" :src="audioUrl" type="audio/mpeg" />
	</div>
</template>
<script lang="ts" setup>
	const props = defineProps({
		audioUrl: String,
		isStop: Boolean
	})
	const audioPlayer = ref<HTMLAudioElement | null>(null)
	watch(
		() => props.audioUrl,
		(newUrl) => {
			//重新加载音频
			audioPlayer.value.load()
			audioPlayer.value.play()
		}
	)
	watch(
		() => props.isStop,
		(newVal) => {
			console.log(newVal)
			if (newVal) {
				audioPlayer.value.pause()
				audioPlayer.value.currentTime = 0
			}
		}
	)
</script>
